<template>
  <div>
    <div class="first-content">
			<div class="pic home-picture" :style="{background: 'url(' +  require('../assets/images/homebg.jpg') + ')'}">
				<div class="overlay"></div>
				<div class="content">
					<h3>Y . J 的 博 客</h3>
				</div>
			</div>
		</div>
    <div class="container" style="margin-bottom: 20px;">
			<div class="second-section">
				<div class="
              col-lg-8 col-lg-offset-1
              col-md-8 col-md-offset-1
              col-sm-12
              col-xs-12
              bloglist
            ">
					<ArticleList />
				</div>
        <div class="
              col-lg-3 col-lg-offset-0
              col-md-3 col-md-offset-0
              col-sm-12
              col-xs-12
              sidebar-container
            ">
            <Sidebar />
        </div>
			</div>
		</div>
  </div>
</template>

<script>
import Sidebar from '@/components/Sidebar'
import ArticleList from '@/components/ArticleList'

export default {
  components: {
    Sidebar,
    ArticleList
  },
  data() {
    return {
      
    };
  },
  created() {
    
  },
  mounted() {
    
  },
  methods: {
  }
};
</script>

<style scoped>
.sidebar-container {
  margin-top: 25px;
}
.bloglist {
  padding-top: 30px;
}
</style>